<template>
  <!-- 策略管理 页面 -->
  <div class="policyManage-page app-container">
    <el-form ref="formInline1" label-position="left" :inline="true" label-width="70px" :model="formInline" class="demo-form-inline">
      <el-form-item label="" prop="investName">
        <el-input v-model="formInline.investName" size="small" clearable @keyup.enter.native="searchList" placeholder="请输入所属投顾" style="width: 150px;"></el-input>
      </el-form-item>
      <el-form-item label="" prop="strategyName">
        <el-input v-model="formInline.strategyName" size="small" clearable @keyup.enter.native="searchList" placeholder="请输入策略名称" style="width: 150px;"></el-input>
      </el-form-item>
      <el-form-item label="成立时间" prop="selectCreateDate">
        <el-select style="width: 110px;" size="small" v-model="selectCreateDate" clearable placeholder="请选择">
          <el-option
            v-for="(item, i) in selectCreateDateList"
            :key="i"
            :label="item"
            :value="i">
          </el-option>
        </el-select>
        <el-date-picker
          size="small"
          v-model="formInline.startMakeTime"
          type="date"
          :disabled="selectCreateDate!==''"
          style="margin-left: 10px;width: 135px;"
          placeholder="开始日期">
        </el-date-picker>
        ~
        <el-date-picker
          size="small"
          v-model="formInline.endMakeTime"
          type="date"
          :disabled="selectCreateDate!==''"
          @keyup.enter.native="searchList"
          style="width: 135px;"
          placeholder="结束日期">
        </el-date-picker>
      </el-form-item>
      <el-form-item>
        <el-button class="bg-green" size="small" @click="searchList">查询</el-button>
        <el-button type="danger" size="small" class="search-box" @click="addOrUpdateHandle()">添加</el-button>
        <el-button size="small" @click="resetForm(['formInline1', 'formInline2', 'formInline3', 'formInline4'])">重置</el-button>
        <span style="margin-left: 10px;cursor: pointer;color: #1890ff;" @click="isSelectMore = !isSelectMore">{{isSelectMore?'收起筛选':'展示筛选'}}<i :class="isSelectMore?'el-icon-arrow-down':'el-icon-arrow-right'" /></span>
      </el-form-item>
    </el-form>
    <el-form v-show="isSelectMore" ref="formInline2" label-position="left" :inline="true" label-width="70px" :model="formInline" class="demo-form-inline">
      <el-form-item label="投资方法" prop="strategyMethod">
        <!-- <el-checkbox-group v-model="formInline.strategyMethod">
          <el-checkbox border :label="item.strategyMethod" :value="item.methodId" v-for="item in select_method" :key="item.methodId"></el-checkbox>
        </el-checkbox-group> -->
        <el-select v-model="formInline.methodList" size="small" collapse-tags clearable multiple placeholder="投资方法" style="width: 160px;">
          <el-option :label="item.strategyMethod" :value="item.methodId" v-for="item in select_method" :key="item.methodId"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="投资风格" prop="strategyMarket">
        <el-select v-model="formInline.styleList" size="small" clearable placeholder="投资风格" style="width: 120px;">
          <el-option :label="item.styleName" :value="item.styleId" v-for="item in select_style" :key="item.styleId"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="投资市场" prop="strategyMarket">
        <el-select v-model="formInline.marketList" size="small" collapse-tags clearable multiple placeholder="投资市场" style="width: 160px;">
          <el-option :label="item.strategyMarket" :value="item.id" v-for="item in select_market" :key="item.id"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="投资标的" prop="strategySubject">
        <el-select v-model="formInline.subjectList" size="small" collapse-tags clearable multiple placeholder="投资标的" style="width: 160px;">
          <el-option :label="item.strategySubject" :value="item.id" v-for="item in select_subject" :key="item.id"></el-option>
        </el-select>
      </el-form-item>
    </el-form>
    <el-form v-show="isSelectMore" ref="formInline4" label-position="left" :inline="true" label-width="70px" :model="formInline" class="demo-form-inline">
      <!-- 收益-风险区间 -->
      <el-form-item class="label-width-120" label="收益-风险区间" prop="segment">
        <el-select v-model="formInline.segment" size="small" placeholder="请选择" style="width: 110px;">
          <el-option :label="item.name" :value="item.id" v-for="item in segmentList" :key="item.id"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item v-show="formInline" class="label-width-60" label="收益率" prop="syl">
        <el-input-number v-model="formInline.startIncomeRate" size="small" style="width:110px;"></el-input-number>%
        ~
        <el-input-number v-model="formInline.endIncomeRate" size="small" style="width:110px;"></el-input-number>%
      </el-form-item>
      <el-form-item v-show="formInline" label="最大回撤" prop="zdhc">
        <el-input-number v-model="formInline.startMaxDownRate" size="small" style="width:110px;"></el-input-number>%
        ~
        <el-input-number v-model="formInline.endMaxDownRate" size="small" style="width:110px;"></el-input-number>%
      </el-form-item>
      <el-form-item v-show="formInline" class="label-width-80" label="夏普比率≥" prop="sharpeNum">
        <el-input-number v-model="formInline.sharpeRate" size="small" style="width:110px;"></el-input-number>
      </el-form-item>
    </el-form>
    
    <!-- 未展示 收益-风险区间 部分值 -->
    <el-table
      ref="table"
      v-loading="listLoading"
      :key="tableKey"
      :data="list"
      border fit
      size="mini"
      :row-key="row=>row.strategyInfoVo.strategyId"
      :header-cell-style="{background:'#dcedff',color:'#32639d'}"
      @selection-change="handleSelectionChange"
    >
      <el-table-column prop="strategyInfoVo.strategyId" label="编号" align="center" width="60" fixed></el-table-column>
      <!-- <el-table-column type="selection" :reserve-selection="true" width="38" align="center" fixed></el-table-column> -->
      <el-table-column prop="" label="" align="center" width="40" fixed>
        <template slot-scope="scope">
          <el-tooltip effect="dark" :content="scope.row.strategyInfoVo.netWorthStatus" placement="right">
            <svg-icon v-show="scope.row.strategyInfoVo.netWorthStatus" class="strategyName_tips" icon-class="tips" />
          </el-tooltip>
        </template>
      </el-table-column>
      <el-table-column prop="strategyInfoVo.strategyName" label="策略名称" min-width="160" fixed>
        <template slot-scope="scope">
          <span v-if="scope.row.strategyInfoVo.hasNetWorthStatus" style="color: #4f95dd;cursor: pointer;" @click="netWorthHandle(scope.row.strategyInfoVo.strategyId)">
            <div class="flex-v-center">
              <span>{{ scope.row.strategyInfoVo.strategyName }}</span>
            </div>
          </span>
          <span v-else style="color: #999;cursor: pointer;" @click="$message('该策略净值不存在或者少于2条')">{{ scope.row.strategyInfoVo.strategyName }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="" label="对比" align="center" fixed>
        <template slot-scope="{row, $index}">
          <span v-if="row.strategyInfoVo.hasNetWorthStatus" class="pointer" :class="{'fontcolor': !row.addContrast}" @click="addContrasthandle(row, $index)">
            <span v-show="!row.addContrast" class="iconfont icon-jia" />
            <span v-show="row.addContrast" class="iconfont icon-check contrastGray" />
            <span :class="{'contrastGray': row.addContrast}" style="padding-left: 2px;">{{!row.addContrast ? '对比' : '已加'}}</span>
          </span>
          <span v-else class="contrastGray" @click="$message('该策略净值不存在或者少于2条')">
            <span class="iconfont icon-jia" />
            <span style="padding-left: 2px;">对比</span>
          </span>
        </template>
      </el-table-column>
      <el-table-column prop="strategyInfoVo.investName" label="所属投顾" align="center" min-width="120" show-overflow-tooltip></el-table-column>
      <el-table-column prop="strategyInfoVo.strategyMarket" label="投资市场" align="center" min-width="100"></el-table-column>
      <el-table-column prop="strategyInfoVo.strategyStyle" label="投资风格" align="center" width="80"></el-table-column>
      <el-table-column prop="strategyInfoVo.strategyMethod" label="投资方法" align="center" min-width="100" show-overflow-tooltip></el-table-column>
      <el-table-column prop="strategyInfoVo.strategySubject" label="投资标的" align="center" min-width="120" show-overflow-tooltip></el-table-column>
      <el-table-column prop="strategyInfoVo.strategyBenchmarkingIndex" label="对标指数" align="center" min-width="80" show-overflow-tooltip></el-table-column>
      <el-table-column prop="strategyInfoVo.createdName" label="创建人" min-width="100" show-overflow-tooltip align="center"></el-table-column>
      <el-table-column prop="strategyInfoVo.makeTime" label="成立日期" sortable align="center" width="100">
        <template slot-scope="scope">
          <span>{{ scope.row.strategyInfoVo.makeTime | parseTime }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="netWorthDetialBean.networthTime" label="净值时间" sortable align="center" width="100"></el-table-column>
      <el-table-column prop="netWorthDetialBean.unitNetworth" label="单位净值" sortable align="center" width="100"></el-table-column>
      <el-table-column prop="netWorthDetialBean.reinstatementNetworth" label="累计净值" sortable align="center" width="100"></el-table-column>
      <el-table-column prop="netWorthDetialBean.cumulativeNetworth" label="复权净值" sortable align="center" width="100"></el-table-column>
      <el-table-column prop="netWorthDetialBean.thisyearAnnualizedincomeRate" label="今年以来收益率" sortable align="center" width="142">
        <template slot-scope="scope">
          <span v-if="scope.row.netWorthDetialBean.thisyearAnnualizedincomeRate!=null" :class="scope.row.netWorthDetialBean.thisyearAnnualizedincomeRate>0?'positiveFc':'negativeFc'">
            {{ scope.row.netWorthDetialBean.thisyearAnnualizedincomeRate }}%
          </span>
          <span v-else>--</span>
        </template>
      </el-table-column>
       <el-table-column prop="netWorthDetialBean.annualizedincomeRate" label="收益率" sortable align="center" width="100">
        <template slot-scope="scope">
          <span v-if="scope.row.netWorthDetialBean.annualizedincomeRate!=null" :class="scope.row.netWorthDetialBean.annualizedincomeRate>0?'positiveFc':'negativeFc'">
            {{ scope.row.netWorthDetialBean.annualizedincomeRate }}%
          </span>
          <span v-else>--</span>
        </template>
      </el-table-column>
      <el-table-column prop="riskIndicatorsBean.maximumDrawdownRate" label="最大回撤" sortable align="center" width="100">
        <template slot-scope="scope">
          <span v-if="scope.row.riskIndicatorsBean.maximumDrawdownRate!=null">{{ scope.row.riskIndicatorsBean.maximumDrawdownRate }}%</span>
          <span v-else>--</span>
        </template>
      </el-table-column>
      <el-table-column prop="riskIndicatorsBean.annualizedIncomeRate" label="收益率(年化)" sortable align="center" width="130">
        <template slot-scope="scope">
          <span v-if="scope.row.riskIndicatorsBean.annualizedIncomeRate!=null" :class="scope.row.riskIndicatorsBean.annualizedIncomeRate>0?'positiveFc':'negativeFc'">
            {{ scope.row.riskIndicatorsBean.annualizedIncomeRate }}%
          </span>
          <span v-else>--</span>
        </template>
      </el-table-column>
      <el-table-column prop="riskIndicatorsBean.annualFluctuationsRate" label="波动率(年化)" sortable align="center" width="130">
        <template slot-scope="scope">
          <span v-if="scope.row.riskIndicatorsBean.annualFluctuationsRate!=null">{{ scope.row.riskIndicatorsBean.annualFluctuationsRate }}%</span>
          <span v-else>--</span>
        </template>
      </el-table-column>
      <el-table-column prop="riskIndicatorsBean.sharpeRate" label="夏普率" align="center" sortable width="100">
        <template slot-scope="scope">
          <span v-if="scope.row.riskIndicatorsBean.sharpeRate!=null">{{ scope.row.riskIndicatorsBean.sharpeRate }}</span>
          <span v-else>--</span>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" fixed="right" width="140">
        <template slot-scope="{row}">
          <el-button class="filter-item" size="mini" type="primary" icon="el-icon-edit-outline" @click="enternetValueHandle(row)">录入净值</el-button>
          <el-popover popper-class="policyManage_popover" trigger="hover" placement="bottom">
            <div class="flex-vh-center">
              <el-button class="filter-item" size="mini" type="primary" icon="el-icon-edit" @click="addOrUpdateHandle(row.strategyInfoVo.strategyId)">
                编辑
              </el-button>
              <el-button style="margin: 10px 0 0 0;" class="filter-item" size="mini" type="primary" icon="el-icon-delete" @click="deleteHandle(row.strategyInfoVo.strategyId)">
                删除
              </el-button>
            </div>
            <span class="operationMore" slot="reference">···</span>
          </el-popover>
        </template>
      </el-table-column>
    </el-table>
    <pagination v-show="total>0" :total="total" :page.sync="listQuery.pageCurrent" :limit.sync="listQuery.limit" @pagination="getList" />
    
    <addOpen v-if="addOrUpdateOpenVisible" ref="addOpen" @closeOpen="getList"></addOpen>
    <enternetValueOpen ref="enternetValueOpen" v-if="hasEnternetValueOpen" @closeOpen="getList"></enternetValueOpen>
    <globalContrastOpen ref="globalContrastOpen" v-show="contrastList.length" :list="contrastList"></globalContrastOpen>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import Pagination from '@/components/Pagination'
import addOpen from './add.vue'
import { fetchList, strategyType, deleteStrategyInfo } from '@/api/policyManage'
import { parseTime } from '@/utils'
import enternetValueOpen from './enternetValueOpen.vue'
import globalContrastOpen from '@/components/investComn/globalContrastOpen.vue'

export default {
  name: 'PolicyManage',
  components: { Pagination, addOpen, enternetValueOpen, globalContrastOpen },
  data() {
    return {
      tableKey: 1,
      addContrasting: false, // 是否有勾选全局对比

      hasEnternetValueOpen: false,

      addOrUpdateOpenVisible: false,
      dict: [],

      segmentList: [
        {
          id: 0,
          name: '今年以来'
        },
        {
          id: 1,
          name: '近一月'
        },
        {
          id: 3,
          name: '近三月'
        },
        {
          id: 6,
          name: '近六月'
        },
        {
          id: 12,
          name: '近一年'
        },
        {
          id: 24,
          name: '近两年'
        },
        {
          id: 36,
          name: '近三年'
        },
        {
          id: 99,
          name: '成立以来'
        },
      ],
      searchProfitList: ['收益排名10%', '收益排名20%', '收益排名30%'],
      maximumDrawdownRateList: ['回撤排名10%', '回撤排名20%', '回撤排名30%'],
      sharpeRateList: ['夏普比率排名10%', '夏普比率排名20%', '夏普比率排名30%'],
      sharpeNum: '',
      syl: '',
      zdhc: '',

      isSelectMore: false,
      selectCreateDateList: ['6个月以下', '6个月-1年', '1-3年', '3-5年', '5年以上'],
      selectCreateDate: '',
      selectNewDataList: ['15天内', '30天内', '45天内', '60天内'],
      selectNewData: '',
      formInline: {
        searchType: 1, // 模糊搜索
        segment: 0,
        startMakeTime: null,
        endMakeTime: null,
        date3: null,
        date4: null,
      },
      select_market: [],
      select_method: [],
      select_style: [],
      select_subject: [],

      total: 0,
      listLoading: false,
      listQuery: {
        pageCurrent: 1,
        limit: 20
      },
      list: [],
      multipleSelection: [],

      uploadBtnIcon: '',

    }
  },
  computed: {
    ...mapGetters([
      'userId', 'contrastList'
    ])
  },
  watch: {
    syl(i) {
      const list = [10,20,30]
      this.formInline.syl1 = 0
      this.formInline.syl2 = list[i]
    },
    zdhc(i) {
      const list = [10,20,30]
      this.formInline.zdhc1 = 0
      this.formInline.zdhc2 = list[i]
    },
    sharpeNum(i) {
      const list = [10,20,30]
      this.formInline.sharpeNum1 = 0
      this.formInline.sharpeNum2 = list[i]
    },
    selectCreateDate(val) {
      if(typeof val === 'number') {
        const list = [[0, 6], [6, 12], [12, 36], [36, 60], [60, 0]]
        this.formInline.startMakeTime = this.stageDate(list[val][0], list[val][1])[0]
        this.formInline.endMakeTime = this.stageDate(list[val][0], list[val][1])[1]
        if(val == 4) this.formInline.startMakeTime = null
      }else {
        this.formInline.startMakeTime = null
        this.formInline.endMakeTime = null
      }
    },
    selectNewData(val) {
      if(typeof val === 'number') {
        const list = [15, 30, 45, 60]
        const startTime = new Date().getTime() - 3600 * 1000 * 24 * list[val]
        const start = parseTime(startTime, '{y}-{m}-{d}')
        this.formInline.date3 = start
        this.formInline.date4 = parseTime(new Date(), '{y}-{m}-{d}')
      }else {
        this.formInline.date3 = ''
        this.formInline.date4 = ''
      }
    },
    contrastList(newList, oldList) {
      if(newList.length == oldList.length) { // todo 此处newList==oldList则是数组减少，未知原因
        this.syncContrastListHandle()
      }
      if(!newList.length) {
        this.list.forEach((row) => {
          row.addContrast = false
        })
        this.tableKey++
      }
    }
  },
  created() {
    if(this.$route.query.investName) {
      this.formInline.investName = this.$route.query.investName
      this.formInline.investCreatedBy = this.$route.query.investCereatedby
      this.formInline.searchType = 0
    }
    if(this.$route.query.boardStatus) {
      this.formInline.boardStatus = this.$route.query.boardStatus
    }
    this.getList()
    this.getStrategyType()
  },
  activated() {
    if(this.contrastList.length) {
      this.$refs.globalContrastOpen.showOpen = true
    }
    if(this.$route.query.investName&&this.$route.query.investName!=this.formInline.investName) {
      this.formInline.investName = this.$route.query.investName
      this.formInline.investCreatedBy = this.$route.query.investCereatedby
      this.formInline.searchType = 0
      this.getList()
      this.getStrategyType()
    }
  },
  methods: {
    // 同步对比框数据和列表数据
    syncContrastListHandle() {
      let tag = 0
      if(!this.contrastList.length) {
        this.list.forEach(row => {
          tag = 1
          row.addContrast = false
        })
      }else {
        const list = this.contrastList.filter(item => item.contrastObj.type==1)
        this.list.forEach((row, index) => {
          row.addContrast = false
          const i = list.findIndex(item => item.contrastObj.id==row.strategyInfoVo.strategyId)
          if(i!=-1) {
            tag = 1
            this.list[index].addContrast = true
          }
        })
      }
      if(tag) this.tableKey++
    },
    addContrasthandle(row, i) {
      this.$refs.globalContrastOpen.showOpen = true
      row.addContrast = !row.addContrast
      if(this.contrastList.length==20) {
        this.$message({
          message: '最多添加20条数据',
          type: 'warning'
        })
        return
      }
      this.$set(this.list, i, row)  // 更新表格数据
      if(row.addContrast) {
        row.contrastObj = {
          type: 1,
          id: row.strategyInfoVo.strategyId,
          name: row.strategyInfoVo.strategyName,
          enterTime: row.strategyInfoVo.makeTime
        }
        this.$store.commit('contrast/addContrastList', row)
      }else {
        const i = this.contrastList.findIndex(item => item.contrastObj.id==row.strategyInfoVo.strategyId&&item.contrastObj.type==1)
        this.$store.commit('contrast/removeContrastList', i)
      }
    },
    enternetValueHandle(params) {
      const row = params.strategyInfoVo
      this.hasEnternetValueOpen = true
      this.$nextTick(() => {
        this.$refs.enternetValueOpen.init({ 
          investName: row.investName, strategyId: row.strategyId, strategyName: row.strategyName, userId: this.userId, strategyNetWorthStyle: row.strategyNetWorthStyle,
          networth: params.netWorthDetialBean.unitNetworth, networthTime: params.netWorthDetialBean.networthTime
        })
      })
    },
    // contrastHandle() {
    //   if(this.multipleSelection.length<2) {
    //     this.$message({
    //       type: 'warning',
    //       message: '请先勾选列表中2条以上策略',
    //       duration: 2000
    //     })
    //     return false
    //   }
    //   if(this.multipleSelection.length>20) {
    //     this.$message({
    //       type: 'warning',
    //       message: '对比策略不得多于20条',
    //       duration: 2000
    //     })
    //     return false
    //   }
    //   this.$router.push({
    //     path: '/policyManage/contrast',
    //     query: {
    //       list: JSON.stringify(this.multipleSelection)
    //     }
    //   })
    // },
    handleSelectionChange(val) {
      this.multipleSelection = val.map(item => {
        return {
          strategyId: item.strategyInfoVo.strategyId,
          strategyName: item.strategyInfoVo.strategyName
        }
      })
    },
    deleteHandle(strategyId) {
      this.$confirm('确认删除？', '提示', {
        type: 'warning'
      }).then(_ => {
        deleteStrategyInfo({
          strategyId
        }).then(res => {
          if(res.code == 0) {
            this.$notify({
              type: 'success',
              message: '删除成功',
              duration: 2000
            })
            this.getList()
          }
        })
      }).catch(_ => {})
    },
    addOrUpdateHandle(strategyId) {
      this.addOrUpdateOpenVisible = true
      this.$nextTick(() => {
        if(this.$route.query.investName) {
          this.$refs.addOpen.init(strategyId, this.dict, this.userId, this.$route.query.investName)
        }else {
          this.$refs.addOpen.init(strategyId, this.dict, this.userId)
        }
      })
    },
    stageDate(s, e) {
      const s_time = s ? s*30 : 1
      const day = parseTime(new Date(), '{d}')
      const endTime = new Date().getTime() - 3600 * 1000 * 24 * s_time
      const startTime = new Date().getTime() - 3600 * 1000 * 24 * e * 30.5
      let end = parseTime(endTime, '{y}-{m}-{d}')
      let start = parseTime(startTime, '{y}-{m}-{d}')
      const endList = end.split('-')
      const startList = start.split('-')
      endList[2] = day
      startList[2] = day
      start = startList.join('-')
      end = endList.join('-')
      return [start, end]
    },
    resetForm(formNameList) {
      // history.pushState('a', null, '#/policyManage') // 重置url?后搜索条件
      formNameList.forEach(element => {
        this.$refs[element].resetFields()
      })
      this.selectCreateDate = ''
      this.selectNewData = ''
      this.formInline = {
        searchType: 1, // 模糊搜索
        segment: 0,
        startMakeTime: null,
        endMakeTime: null,
        date3: null,
        date4: null,
      }
      this.$router.push('/policyManage')
      this.getList()
    },
    netWorthHandle(id) {
      this.$router.push({
        path: `/policyManage/netWorthAnalysis/${id}`,
        query: {
          userId: this.userId
        }
      })
    },
    getStrategyType() {
      strategyType().then(res => {
        console.log('分类', res)
        this.dict = res.body
        this.select_market = res.body.market
        this.select_method = res.body.method
        this.select_style = res.body.style
        this.select_subject = res.body.subject
      })
    },
    searchList() {
      this.listQuery.pageCurrent = 1
      this.getList()
    },
    getList() {
      this.listLoading = true
      fetchList({
        userId: this.userId,
        ...this.listQuery,
        ...this.formInline
      }).then(res => {
        this.listLoading = false
        console.log('策略管理', res)
        this.list = res.body
        this.total = res.count || 0

        if(this.contrastList.length) this.syncContrastListHandle()
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.policyManage-page {
  position: relative;
  .new-date {
    ::v-deep .el-form-item__label {width: 100px !important;}
  }
  .label-width-120 {
    ::v-deep .el-form-item__label {width: 110px !important;}
  }
  .label-width-60 {
    ::v-deep .el-form-item__label {width: 56px !important;}
  }
  .label-width-80 {
    ::v-deep .el-form-item__label {width: 80px !important;}
  }

  .strategyName_tips {
    min-width: 18px;
    font-size: 18px;
    // color: #ffa631;
    color: #FB9391;
    margin-left: 2px;
  }

  .operationMore {
    padding-left: 10px;
    font-weight: bold;
    cursor: pointer;
  }
  .icon-jia {
    font-size: 12px;
  }
  
}
</style>

<style>
.policyManage_popover {
  min-width: 0;
}
</style>
